// 入口文件
console.log('OK')
import Vue from 'vue';
import VueRouter from 'vue-router';
Vue.use(VueRouter);
/* import { Header,Swipe,SwipeItem,Button,Lazyload} from 'mint-ui';
Vue.component(Header.name,Header);
Vue.component(Swipe.name,Swipe);
Vue.component(SwipeItem.name,SwipeItem);
Vue.component(Button.name,Button);
Vue.use(Lazyload); */
//按需导入muit-ui,懒加载会出问题，只能全部导入

//启用vuex
import Vuex from 'vuex';
Vue.use(Vuex);
//获取car
var car = JSON.parse(localStorage.getItem('car') || '[]');
var store = new Vuex.Store({
  state: {//// { id:商品的id, count: 要购买的数量, price: 商品的单价，selected: false  }
    car: car//存储购物车商品信息
  },
  mutations: {
    addToCar(state, goodsinfo) {//添加商品到购物车
      // 分析：
      // 1. 如果购物车中，之前就已经有这个对应的商品了，那么，只需要更新数量
      // 2. 如果没有，则直接把 商品数据，push 到 car 中即可

      // 假设 在购物车中，没有找到对应的商品
      console.log(goodsinfo);
      var flag = false;
      state.car.some(item => {
        if (item.id === goodsinfo.id) {
          item.count += parseInt(goodsinfo.count);//注意是加入购物车，只是同一个商品的数量增加
          flag = true;
          return true;
        }
      })
      //store中不存在
      if (!flag) {
        state.car.push(goodsinfo);
      }
      //更新car数据后，把car存储到localStorage中
      localStorage.setItem('car', JSON.stringify(state.car));
    },
    updateGoodsInfo(state,goodsinfo){//实现购物车商品数量的修改
      state.car.some(item=>{
        if(item.id == goodsinfo.id){
          item.count = parseInt(goodsinfo.count);
          return true;
        }
      })
      //当更新完成后，同步数据到localstorage中
      localStorage.setItem('car',JSON.stringify(state.car));
    },
    removeFromCar(state,id){//删除购物车中的数据
      state.car.some((item,i)=>{
        if(item.id == id){
          state.car.splice(i,1);
          return true;
        }
      })
      //删除完成后，更新到本地数据localstorage
      localStorage.setItem('car',JSON.stringify(state.car));
    },
    updateGoodsSelected(state,info){//更新购物车中商品的选中模式到store中
        state.car.some(item=>{
          if(item.id == info.id){
            item.selected = info.selected;
          }
        })
        //更新到本地的localstorage
        localStorage.setItem('car',JSON.stringify(state.car))
    }
  },
  getters: {
    getAllCount(state) {//获取所有选中的商品数量
      var c = 0;
      state.car.forEach(item => {
        c += item.count;
      })
      return c;
    },
    getGoodsCount(state) {//拼接一个对象，把购物车中的对象全拼接为{id：count,id:count}
      var o = {};
      state.car.forEach(item => {
        o[item.id] = item.count;
      })
      return o;
    },
    getGoodsSelected(state){////拼接一个对象，把购物车中的对象全拼接为{id：selected,id：selected}
      var o = [];
      state.car.forEach(item=>{
        o[item.id] = item.selected;
      })
      return o;
    },
    getGoodsCountAndAmount(state){//h获取商品选中的数量和勾选的总价
      var o = {
        count:0,//勾选的数量
        amount:0//勾选的总价
      }
      state.car.forEach(item=>{
        if(item.selected){
          o.count += item.count;
          o.amount += item.price * item.count;
        }
      })
      return o;

    }
  }
})

import MintUI from 'mint-ui'
import 'mint-ui/lib/style.css'
Vue.use(MintUI)

import router from './router.js'
import app from './App.vue';

import './lib/mui/css/mui.min.css'
import "./lib/mui/css/icons-extra.css"

import VueResource from 'vue-resource'
Vue.use(VueResource);
// 设置请求的根路径
Vue.http.options.root = 'http://127.0.0.1:5001';
// 全局设置 post 时候表单数据格式组织形式   application/x-www-form-urlencoded
Vue.http.options.emulateJSON = true;

//导入时间化格式的插件
import moment from 'moment';
//定义全局过滤器
Vue.filter('dateFormat', function (dateStr, pattern = "YYYY-MM-DD HH:mm:ss") {
  return moment(dateStr).format(pattern);
})
//缩略图
import VuePreview from 'vue-preview'
Vue.use(VuePreview);
Vue.use(VuePreview, {
  mainClass: 'pswp--minimal--dark',
  barsSize: { top: 0, bottom: 0 },
  captionEl: false,
  fullscreenEl: false,
  shareEl: false,
  bgOpacity: 0.85,
  tapToClose: true,
  tapToToggleControls: false
})

var vm = new Vue({
  el: '#app',
  render: c => c(app),
  router,
  store//挂载store状态管理对象
})